@tailwind base;
@tailwind components;
@tailwind utilities;
:root {
  /*  --h:100/974.46;
  --w:100/1920; */
}
/* @function calcWidth(value) {
  @return calc(value * var(--w));
}
@function calcHeight(value) {
  @return calc(value * var(--h));
} */
body {
  margin: 0;
  color: var(--joy-palette-text-primary, var(--joy-palette-neutral-800, #25252d));
  font-family: var(--joy-fontFamily-body, var(--joy-Josefin Sans, sans-serif));
  font-size: var(--joy-fontSize-md, 1rem);
  line-height: var(--joy-lineHeight-md, 1.5);
  /* background-color: var(--joy-palette-background-body); */
}

body .ant-btn-primary {
  background-color: #1677ff;
}

.ant-pagination .ant-pagination-prev * {
  color: rgb(39, 155, 255) !important;
}

.ant-pagination .ant-pagination-next * {
  color: rgb(39, 155, 255) !important;
}

.ant-pagination .ant-pagination-item a {
  color: rgb(176, 176, 191);
}

.ant-pagination .ant-pagination-item.ant-pagination-item-active {
  background-color: rgb(39, 155, 255) !important;
}

.ant-pagination .ant-pagination-item.ant-pagination-item-active a {
  color: white !important;
}

table tr td {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
/* table tbody tr{
  background: red;
} */
.ant-table-wrapper .ant-table-tbody > tr:nth-child(odd) {
  height: calc(30vh * var(--h));
  background: #153d7a;
  color: #fff;
  font-size: calc(14vw * var(--w));
}
.ant-table-wrapper .ant-table-tbody > tr:nth-child(even) {
  height: calc(30vh * var(--h));
  background: #04162f;
  color: #fff;
  font-size: calc(14vw * var(--w));
}
.ant-table-wrapper .ant-table-tbody > tr > td {
  border: none;
}
.ant-table-wrapper .ant-table-tbody > tr.ant-table-row:hover > td {
  background: none;
}
/* 自定义滚动条样式 */
::-webkit-scrollbar {
  display: none;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #888;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}

/* .dark :where(.css-dev-only-do-not-override-1lg77cm).ant-tabs .ant-tabs-tab-btn {
  color: white;
}
:where(.css-dev-only-do-not-override-1lg77cm).ant-form-item .ant-form-item-label > label {
  height: 36px;
}
:where(.css-dev-only-do-not-override-1lg77cm).ant-input-lg{
  padding: 7px 0px;
} */

.custom-textarea::placeholder {
  color: #fff;
}
.text-white .ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap {
  background: #0d87bc;
  height: calc(28vh * var(--h));
  margin-top: calc(16vh * var(--h));
}
.text-white .ant-tabs-card.ant-tabs-top > .ant-tabs-nav .ant-tabs-tab-active {
  background: #fff;
  width: calc(80vw * var(--w));
  border-radius: 0px !important;
  display: flex;
  justify-content: center;
  font-size: calc(14vw * var(--w));
}
.text-white .ant-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #000 !important;
  font-size: calc(14vw * var(--w));
}
.text-white .ant-tabs-card.ant-tabs-small.ant-tabs-top > .ant-tabs-nav .ant-tabs-tab {
  width: calc(80vw * var(--w));
  border: 0px;
  display: flex;
  justify-content: center;
  font-size: calc(14vw * var(--w));
}
.ant-table-wrapper .ant-table-thead > tr > th {
  background: #0d87bc;
  color: #fff;
  font-size: calc(16vw * var(--w));
  height: calc(40vh * var(--h));
  white-space: nowrap;
  margin-bottom: calc(4vh * var(--h));
  border: none;
  border-start-start-radius: 0px;
}
.ant-table-wrapper
  .ant-table-thead
  > tr
  > th:not(:last-child):not(.ant-table-selection-column):not(.ant-table-row-expand-icon-cell):not([colspan])::before {
  width: 0px;
  height: 0px;
}
.text-white .ant-tabs .ant-tabs-content-holder {
  background: #04162f;
  padding: calc(23vh * var(--h)) calc(23vw * var(--w));
}
.text-white .ant-tabs-top > .ant-tabs-nav {
  margin: 0px;
}
.text-white .ant-tabs-top > .ant-tabs-nav::before,
.text-white .ant-tabs-bottom > .ant-tabs-nav::before,
.text-white .ant-tabs-top > div > .ant-tabs-nav::before,
.text-white .ant-tabs-bottom > div > .ant-tabs-nav::before {
  border: none;
}
.custom-chat-bg {
  /*   background: rgba(28, 95, 168, 0.4); */
  /* border: 1.5px solid #4c9ae1; */
  background: #3076df;
  border-radius: calc(8vh * var(--h));
  font-size: calc(18vw * var(--w));
}

.top-left-border {
  width: calc(5vw * var(--w));
  height: calc(1h * var(--h));
  position: absolute;
  left: calc(10vw * var(--w));
  top: 0;
}

.top-right-border {
  width: calc(5vw * var(--w));
  height: calc(1vh * var(--h));
  position: absolute;
  right: calc(10vw * var(--w));
  top: 0;
}

.left-top-border {
  width: calc(1.5vw * var(--w));
  height: calc(5vh * var(--h));
  position: absolute;
  left: 0;
  top: calc(10vh * var(--h));
}

.left-bottom-border {
  width: calc(1.5vw * var(--w));
  height: calc(5vh * var(--h));
  position: absolute;
  left: 0;
  bottom: calc(10vh * var(--h));
}

.right-top-border {
  width: calc(1vw * var(--w));
  height: calc(5vh * var(--h));
  position: absolute;
  right: 0;
  top: calc(10vh * var(--h));
}

.right-bottom-border {
  width: calc(1vw * var(--w));
  height: calc(5vh * var(--h));
  position: absolute;
  right: 0;
  bottom: calc(10vh * var(--h));
}

.bottom-left-border {
  width: calc(5vw * var(--w));
  height: calc(1.5vh * var(--h));
  position: absolute;
  left: 10px;
  bottom: 0;
}

.bottom-right-border {
  width: calc(5vw * var(--w));
  height: calc(1.5vh * var(--h));
  position: absolute;
  right: calc(10vw * var(--w));
  bottom: 0;
}

.custom-chat-bg.robot-bg {
  background: #153d70;
  backdrop-filter: blur(4px);
  position: relative;
  padding: calc(20vh * var(--h)) calc(25vw * var(--w));
  border-radius: calc(8vh * var(--h));
  font-size: calc(18vw * var(--w));
}
.custom-chat-bg.robot-bg::before {
  content: '';
  position: absolute;
  left: 0%;
  top: 6px;
  /* transform: translate(-50%,0); */ /* 居中显示 */
  border: 0.6rem solid transparent; /* 小三角的大小 */
  　border-right-color: #153178; /* 小三角朝左 */
}
.custom-chat-bg.robot-bg li {
  color: #fff;
}
.guess-like {
  display: flex;
  align-items: center;
  color: #fff;
  height: calc(52vh * var(--h));
  margin-bottom: calc(10vh * var(--h));
  width: calc(100% - 0px);
}
.boxMessage {
  height: calc(180vh * var(--h));
  background: #000;
  padding: calc(24vh * var(--h)) calc(28vw * var(--w)) calc(32vh * var(--h));
}
.sendMeesge {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: calc(5vh * var(--h));
}
.myTooltip {
  font-size: calc(14vw * var(--w));
  height: calc(30vh * var(--h));
  margin-right: calc(10vw * var(--w));
  top: calc(1140.07vh * var(--h));
  left: calc(1576.32vw * var(--w));
  max-width: none;
}
.myTooltip .ant-tooltip-inner {
  height: calc(30vh * var(--h));
  min-height: calc(30vh * var(--h));
  padding: calc(4vh * var(--h)) calc(8vw * var(--w));
  border-radius: 0px;
}
/* .myTooltip .ant-tooltip-arrow{
  width: calc(16vw * var(--w));
  height: calc(16vh * var(--h));
  top: calc(14.9844vh * var(--h));
}
.myTooltip .ant-tooltip-arrow::after{
  width: calc(8.9705vw * var(--w));
  height: calc(8.9705vh * var(--h));
}
.myTooltip .ant-tooltip-arrow::before{
  width: calc(16vw * var(--w));
  height: calc(8vh * var(--h));
} */
.guess-like .left {
  width: calc(72vw * var(--w));
  font-weight: 600;
  font-size: calc(16vw * var(--w));
}

.guess-like .right {
  flex: 1;
  overflow-x: auto;
  font-weight: 600;
  overflow-y: hidden;
  padding: calc(6vh * var(--h)) 0px calc(6vh * var(--h));
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: calc(15vw * var(--w));
}

.guess-like .right::-webkit-scrollbar {
  display: block;
  height: calc(4vh * var(--h));
  /*  background-color: #f5f5f5; */
  background: #103461;
}

.guess-like .right::-webkit-scrollbar-thumb {
  border-radius: calc(4vh * var(--h));
  background: #55beff;
}

.guess-like .right::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 calc(4vh * var(--h)) rgba(0, 0, 0, 0.3);
  border-radius: calc(4vh * var(--h));
  background: #103461;
}

.guess-like .right .question {
  padding: calc(2vh * var(--h)) calc(15vw * var(--w));
  border-radius: calc(30vh * var(--h));
  line-height: calc(32vh * var(--h));
  font-size: calc(14vw * var(--w));
  border: calc(1.5vh * var(--h)) solid #4c9ae1;
  flex-shrink: 0;
  cursor: pointer;
}

.chat-resizable {
  /*   position: absolute !important; */
  position: absolute !important;
  left: calc((100vw - 1047vw * var(--w)) / 2);
  bottom: calc((100vh - 870vh * var(--h)) / 2);
  width: calc(1247vw * var(--w)) !important;
  height: calc(870vh * var(--h)) !important;
  /* background: linear-gradient(180deg, rgba(3, 17, 54, 0.5) 0%, rgba(3, 17, 54, 0.5) 100%); */
  /* background: #000; */
  background-image: url('../public/borderBottom.png');
  background-repeat: no-repeat;

  background-size: 100% 100%;
  box-shadow: 0px 4px 10px 0px #3d6dd9;
}
/* .chat-resizable::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 10px;
  height: 10px;
  border-left: 2px solid #48a8ff;
  border-bottom: 2px solid #48a8ff;
  border-right: none;
  border-top: none;
}

.chat-resizable::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  width: 10px;
  height: 10px;
  border-right: 2px solid #48a8ff;
  border-bottom: 2px solid #48a8ff;
  border-left: none;
  border-top: none;
} */
.custom-label {
  display: inline-block;
  word-break: break-all;
  /* 或者使用word-wrap: break-word; */
}
.robot {
  /* height: calc(46vh * var(--h));
  width: calc(707vw * var(--w));
  border-radius: calc(30vh * var(--h));
  display: flex;
  align-items: center;
  padding-left: calc(18vw * var(--w));
  margin-left: calc(13vw * var(--w));
  border: calc(1.5vh * var(--h)) solid #11bcff; */
}
.robot{
  height: 40px;
  width: 600px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  padding-left: 18px;
  margin-left: 13px;
  border: 1.5px solid #11bcff;
}
.robot span {
  font-size: 14px;
  color: #fff;
  font-family: 'Source Han Sans CN, Source Han Sans CN';
  text-transform: none;
}
.mt-30 {
  margin-top: calc(30vh * var(--h));
}
.ant-table-content {
  overflow-x: auto;
  /* width:  calc(745vw * var(--w)); */
  /* border-radius: calc(4vh * var(--h)); */
  border-top-left-radius: calc(4vh * var(--h));
  border-top-right-radius: calc(4vh * var(--h));
}
.ant-table-content::-webkit-scrollbar {
  display: block;
  height: calc(4vh * var(--h));
  /*  background-color: #f5f5f5; */
  background: #103461;
}

.ant-table-content::-webkit-scrollbar-thumb {
  border-radius: calc(4vh * var(--h));
  background: #55beff;
}

.ant-table-content::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 calc(4vh * var(--h)) rgba(0, 0, 0, 0.3);
  border-radius: calc(4vh * var(--h));
  background: #103461;
}
.loadingChat {
  padding: calc(5vh * var(--h)) calc(5vw * var(--w));
  display: flex;
  align-items: center;
  animation: loading-animation 3s infinite; /* 无限重复播放动画，持续时间为3秒 */
}

@keyframes loading-animation {
  0% {
    opacity: 1;
  } /* 初始状态 - 完全不透明 */
  50% {
    opacity: 0.2;
  } /* 中间状态 - 部分透明度 */
  100% {
    opacity: 1;
  } /* 结束状态 - 完全不透明 */
}
.modal {
  position: fixed; /* 设置为fixed定位 */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* 添加蒙层效果 */
.modal::before {
  content: '';
  display: block;
  background-color: rgba(0, 0, 0, 0.5); /* 黑色半透明作为蒙层 */
  /* background-image: url('../public/modalBackground.png'); */
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1; /* 将蒙层放在最后面显示 */
}
.ant-table-placeholder {
  background: #04162f !important;
}
/* :where(.css-dev-only-do-not-override-1lg77cm).ant-empty-normal .ant-empty-description {
  color: #0d87bc
} */
/* :where(.css-dev-only-do-not-override-1lg77cm).ant-empty .ant-empty-image svg g{
  fill: #fafafa;
} */
.ant-empty-normal .ant-empty-description {
  color: #0d87bc;
}
.ant-empty .ant-empty-image svg g {
  fill: #fafafa;
}
.tipMessage {
  align-items: center;
  width: 100%;
  display: flex;
  color: #fff;
  /* padding: calc(30vh * var(--h)) calc(30vw * var(--w)); */
}
.tipMessage img {
  margin-right: calc(10vw * var(--w));
}
.robotSize {
  width: calc(40vw * var(--w));
  height: calc(40vh * var(--h));
  cursor: pointer;
}
.tipTitle {
  background: #153d70;
  border-radius: calc(5vh * var(--h));
  padding: calc(10vh * var(--h)) calc(15vw * var(--w));
  font-size: calc(14vw * var(--w));
}
button span {
  font-size: calc(16vw * var(--w));
}
button svg {
  width: calc(20vw * var(--w));
  height: calc(22vh * var(--h));
}
textarea {
  height: calc(40vh * var(--h)) !important;
  max-height: calc(40vh * var(--h)) !important;
  min-height: calc(40vh * var(--h)) !important;
  align-items: center;
  display: flex;
}
.ant-input-lg {
  padding-top: calc(5vh * var(--h)) !important;
  padding-left: calc(10vw * var(--w)) !important;
  padding-right: calc(5vw * var(--w)) !important;
  padding-bottom: calc(5vh * var(--h)) !important;
}
.px-1 {
  padding: calc(5vh * var(--h)) calc(5vw * var(--w));
}
.px-2 {
  padding: calc(10vh * var(--h)) calc(10vw * var(--w));
}
.px-4 {
  padding: calc(15vh * var(--h)) calc(15vw * var(--w));
}
.custom-chat-bg.robot-bg p {
  line-height: 150%;
  font-size: calc(16vw * var(--w));
}
pre code {
  font-size: calc(16vw * var(--w));
}
.ant-table-wrapper .ant-table {
  background: transparent;
}
.auto-chart-content{
  min-width: calc(880vw * var(--w));
  min-height: calc(320vh * var(--h));
}
.ant-select-single.ant-select-sm:not(.ant-select-customize-input) .ant-select-selector {
  height: calc(24vh * var(--h));
}
.ant-select-selection-item {
  font-size: calc(14vw * var(--w)) !important;
}
.ant-select-single.ant-select-sm:not(.ant-select-customize-input).ant-select-show-arrow .ant-select-selection-item {
  display: flex;
  align-items: center;
}
.ant-select-dropdown {
  width: calc(180vw * var(--w));
  height: calc(100vh * var(--h));
  font-size: calc(14vw * var(--w)) !important;
  overflow-y: auto;
}
.ant-select-dropdown .ant-select-item-option-content {
  font-size: calc(14vw * var(--w)) !important;
}
.ant-pagination .ant-pagination-item.ant-pagination-item-active {
  width: calc(32vw * var(--w));
  height: calc(32vh * var(--h));
  display: flex;
  align-items: center;
  display: flex;
  justify-content: center;
  font-size: calc(18vw * var(--w));
}
.ant-pagination .ant-pagination-item {
  width: calc(32vw * var(--w));
  height: calc(32vh * var(--h));
  display: flex;
  align-items: center;
  display: flex;
  justify-content: center;
  font-size: calc(18vw * var(--w));
}
.ant-table-wrapper .ant-table-pagination > * {
  width: calc(28vw * var(--w));
  height: calc(32vh * var(--h));
}
.ant-pagination .ant-pagination-disabled .ant-pagination-item-link {
  display: flex;
  align-items: center;
}
.ant-select .ant-select-arrow {
  font-size: calc(12vw * var(--w));
  height: calc(12vh * var(--h));
  margin-top: calc(-6vh * var(--h));
}
.soundWave {
  display: flex;
  gap: calc(4vw * var(--w));
  margin-right: calc(10vw * var(--w));
  /* height: calc( 20vh * var(--h)); */
}
.topSoundWave {
  display: flex;
  width: 100%;
  justify-content: flex-end;
  margin-top: calc(15vh * var(--h));
  margin-bottom: calc(15vh * var(--h));
}
.boxWave {
  background: #3076df;
  width: max-content;
  gap: calc(4vw * var(--w));
  padding: calc(20vh * var(--h)) calc(20vw * var(--w));
  display: flex;
  justify-content: flex-end;
  border-radius: calc(20vh * var(--h));
}
.soundWave span {
  height: calc(24vh * var(--h));
  width: calc(2vw * var(--w));
  background: #62f1ff;
  display: block;
  transform-origin: 50%;
}
.numberPerson {
  position: absolute;
  left: calc(165vw * var(--w));
  top: calc(255vh * var(--h));
  width: calc(205vw * var(--w));
  height: calc(758vh * var(--h));
  z-index: 9999;
}
.recorderTempMsg {
  color: #fff;
  padding: calc(20vh * var(--h)) calc(20vw * var(--w));
}
@keyframes stretch {
  0% {
    transform: scaleY(1);
  }
  50% {
    transform: scaleY(0.5);
  }
  100% {
    transform: scaleY(0.1);
  }
}
